<template>
	<div>
		<!--container-->
		<div id="allmap" style="
                width: 100%; 
                height:9.8rem; 
                border: 1px solid gray;
                overflow:hidden;">
		</div>
	</div>
</template>
<script>
	export default {
		data() {
			return {

			}
		},
		mounted() {
			this.ready()
		},
		methods:{
			ready: function() {
				var map = new BMap.Map('allmap')
				var point = new BMap.Point(106.45, 29.53)
				map.centerAndZoom(point, 14)
				map.addControl(new BMap.MapTypeControl())
				map.enableScrollWheelZoom(true)
				map.enableDoubleClickZoom(true)
				var marker = new BMap.Marker(point)
				map.addOverlay(marker)
				map.centerAndZoom(point, 15)
			}
		}
	}
</script>
<style>
	#allmap {
		width: 100%;
		border: none !important;
		box-sizing: border-box;
	}
</style>